<script setup>
import { useRoute } from 'vue-router'
import LfTabs from '@/components/commonUI/LfTabs.vue'
import { userCenterStore } from '@/stores/userCenterStore'
import PostList from './components/PostList/PostList.vue'
import { useUserInfoQuery } from '@/composables/useUserInfoQuery'
import UserHomeInfo from './components/UserHomeInfo.vue'
import ContainerSplitOrFull from '@/components/commonUI/ContainerSplitOrFull.vue'
import LfEmpty from '@/components/commonUI/LfEmpty.vue'
import { useReportPostsQuery } from '@/composables/usePostDataQuery'
import { ref, watch } from 'vue'
const topicList = [
  { id: -1, name: '全部', type: '-1' },
  { id: 0, name: '待审核', type: '0' },
  { id: 1, name: '已处理', type: '1' },
  { id: 2, name: '已拒绝', type: '2' },
]
const { proxy } = getCurrentInstance();


// 获取数据列表
function getDataList(params) {
  proxy
    .$http({
      url: proxy.$http.adornUrl("/admin/report/list"),
      method: "get",
      params,
    })
    .then(({ data }) => {

    });
}

const route = useRoute()

const routeUid = ref(route.params.uid)

console.log(route.query.activeIndex);


const { userInfo } = useUserInfoQuery(routeUid)

watch(route, (newRoute, oldRoute) => {
  routeUid.value = newRoute.params.uid
})

const activeIndex = ref(0)
const status = ref(-1)
function onTabChange(index, id, name, scrollLeft) {
  activeIndex.value = index
  status.value = id
}
const { data: postData, fetchNextPage, isFetching,refetch } = useReportPostsQuery(status)
const flattenedData = computed(() => postData.value?.pages.flatMap((page) => page.result.data) ?? [])
</script>

<template>
  <ContainerSplitOrFull>
    <div class="p-4 max-w-[1600px] mx-auto">
      <UserHomeInfo :userInfo="userInfo" />
      <div>
        <LfTabs :activeIndex="activeIndex" :tabOptions="topicList" :onTopicClick="onTabChange" />
        <div class="py-4">
          <PostList @refetch="refetch" :topicExplore="topicExplore" :posts-data="flattenedData" :isEdit="false" />
        </div>
      </div>
    </div>
  </ContainerSplitOrFull>
</template>
